<template>
  <div class="permitbutton" style="display: none;">
    props_develMaterialCheck:{{ $props.props_develMaterialCheck }}
    $props?.props_materialReceivingDtl:{{ $props?.props_materialReceivingDtl }}
  </div>
  <div class="wrappercontainer" style="position: relative;">
    <div style="display: flex;justify-content: space-between;">
                <span>   <span>供应商:</span> <span>{{ $props.props_materialItemDtl?.supplierName }} <span
                    v-if="$props.props_materialItemDtl?.supplierProCode">({{
                    $props.props_materialItemDtl?.supplierProCode
                  }})</span></span>
    </span>
      <van-button size="mini" plain type="primary" @click="trigger_courierMoney"
                  v-show="computed_show_zhuasong"
                  style="margin-right: 18px;">
        <span v-if="!exitZhuansong">添加专送费</span>
        <span
            v-else>取消专送费</span>
      </van-button>
    </div>
    <template v-if="1==1" desc="颜色">
      <div style="padding-bottom: 10px;"
           v-for="colorItem in ($props.props_materialItemDtl?.dtlColorList||[])">
        <span>颜色:</span>
        <span><span>{{ colorItem.colorName }}</span><span
            v-if="colorItem.supplierColorCode">({{ colorItem.supplierColorCode }})</span></span>
        <span style="padding-left: 20px;">调料: </span><span>{{ toFixedInt(colorItem.develNum) }}</span>
      </div>
    </template>

    <div style="padding-bottom: 5px;;">
      <span><i class="red" style="padding-right: 2px;" v-if="$props.props_billingType!=5">*</i>金额:&nbsp;</span>
      <template v-if="1==1">
        <template v-if="!computed_edit">
          <span>{{ toFixedInt($props.props_develMaterialCheck?.materialMoney) }}</span>
        </template>
        <template v-else>
          <template v-if="$props?.props_develMaterialCheck">
            <inputNumber100 style="width: 88px;" v-model="$props.props_develMaterialCheck.materialMoney"
                            @change="()=>change_materialMoney()"
            />
          </template>
        </template>
      </template>

      <span style="margin-left: 20px;"> 数量:&nbsp;</span>
      <template v-if="1==1">
        <template v-if="!computed_edit">
          <span>{{ toFixedInt($props?.props_develMaterialCheck?.receivingNum) }}</span>
        </template>
        <template v-else>
          <inputNumber100 style="width: 88px;" v-model="$props.props_develMaterialCheck.receivingNum"
          />
        </template>
      </template>

      <!--  明细的 pay状态
       请款中
       设计师拒绝
       -->
      <label v-if="1==1" style="padding-left: 30px;">

        <template v-if="$props.props_materialReceivingDtl?.payState">
          <dic-tag code="material_receiving_paystate"
                   style="margin-left: 4px;margin-bottom: 2px;margin-top: 4px;"
                   :value="$props.props_materialReceivingDtl?.payState"></dic-tag>
        </template>

        <template v-if="$props.props_develMaterialCheck?.checkState==10">
          <van-tag size="mini" type="danger" style="margin-left: 4px;margin-bottom: 2px;margin-top: 4px;">
            设计拒绝
          </van-tag>
        </template>

        <template v-if="1==1">
          <van-tag size="mini" type="success"
                   style="margin-left: 4px;margin-bottom: 2px;margin-top: 4px;"
                   v-if="$props.props_materialReceivingDtl?.expenseType==5">
            <span>可报销</span>
          </van-tag>
          <van-tag size="mini" type="danger"
                   style="margin-left: 4px;margin-bottom: 2px;margin-top: 4px;"
                   v-if="$props.props_materialReceivingDtl?.expenseType==1">
            <span>不可报销</span>
          </van-tag>
        </template>


      </label>

    </div>

    <!-- 是否专送  -->
    <div v-if="exitZhuansong" style="border-top: 1px solid #ddd;padding-top: 10px;margin-top: 10px">
      <div style="display: flex;justify-content: space-between;margin-bottom: 10px;">
        <span>专送费：</span>
        <template v-if="1==1">
          <template v-if="!computed_edit">
            <span>{{ toFixedInt($props?.props_develMaterialCheck?.courierMoney) }}</span>
          </template>
          <template v-else>
            <inputNumber100 style="width: 88px;" v-model="$props.props_develMaterialCheck.courierMoney"
                            @change="()=>change_courierMoney()"
            />
          </template>
        </template>
      </div>
      <div style="display: flex;align-items: flex-start;justify-content: space-between;">
        <span>
            <template v-if="$props.props_billingType!=5">
                 <i class="red" style="padding-right: 2px;"
                    v-if="$props?.props_develMaterialCheck?.courierMoney>0"
                 >*</i>
            </template>
        附件：</span>
        <uploadImagePlus
            :fileList="($props?.props_develMaterialCheck?.attachList||[]).filter(item=>item.expendType=='专送')"
            :uploadType="$uploadType.file_purchase"
            :maxCount="2"
            ref="uploadImageDom"
            expendType="4"
            :disabled="computed_disabled_atachlist"
            @change="files=>{
                              var attachListFilter_no=($props?.props_develMaterialCheck?.attachList||[]).filter(item=>item.expendType!='专送');
                              $props.props_develMaterialCheck.attachList=(attachListFilter_no).concat(files.map(item=>{
                                  item.expendType='专送'
                                  return  item
                              }))
                           }"
                           @deleteFile="deleteFile"
        >
        </uploadImagePlus>
      </div>
    </div>


  </div>
</template>
<script>
import uploadImagePlus from '@/components/UploadImage/uploadImagePlus.vue';
import inputNumber100 from '@/components/inputNumber/inputNumber100.vue';
import DicTag from '@/components/DicTag/dic-tag.vue';
import * as dic from '@/utils/dic';
import { datemmddhhmm } from '@/utils/dateUtils';
import { booleanDefault, toFixedInt } from '@/utils';

function getDevelMethod(mmm) {
  var map = {
    1: '本',
    2: '外',
  };
  return map[mmm];
}
import * as  matertailDevApi from '@/api/material_dev';
import { alertWithPayload } from '@/utils/alertUtil';

export default {
  data() {
    return {
      dic,
      datemmddhhmm,
      getDevelMethod,
      exitZhuansong: booleanDefault(this.$props?.props_develMaterialCheck?.courierMoney > 0, false),
    };
  },
  components: {
    uploadImagePlus,
    inputNumber100,
    DicTag,
  },

  props: {
    props_develMaterialCheck: { type: [Object] },
    props_materialItemDtl: { type: [Object] },
    props_show_close: {
      type: [Boolean],
      default() {
        return true;
      },
    },
    props_develMaterialItemDtl: {
      type: [Object],
    },
    props_develMaterialItem: {
      type: [Object],
    },
    props_materialReceivingDtl: {
      type: [Object],
    },
    props_edit: {
      type: [Boolean],
    },
    props_billingType: {
      type: [String, Number],
    },
  },
  computed: {
    computed_edit() {
      // 付款状态：1 待付款 3 请款中  5 部分付款 10 付款完成
      if (/*如果已經请款的明细是不能编辑的*/this.$props.props_materialReceivingDtl?.payState > 1) {
        return false;
      } else if ((typeof this.$props.props_show_close == 'boolean') && !this.$props.props_show_close) {
        return false;
      }

      return (typeof this.$props.props_edit == 'boolean') && this.$props.props_edit;
    },

    computed_show_close() {
      if ((typeof this.$props.props_show_close == 'boolean') && !this.$props.props_show_close) {
        return false;
      }
      if (/*编辑是false  不能编辑*/(typeof this.$props.props_edit == 'boolean') && !this.$props.props_edit) {
        console.warn('退出逻辑 不能编辑');
        return false;
      }
      return true;
    },
    computed_show_zhuasong() {
      // payState  1 3 5 10
      // 1 待请款
      // 3 请款中
      // 5 部分付款
      // 10  付款完成
      if (/*如果已經请款的明细是不能编辑的*/this.$props.props_materialReceivingDtl?.payState > 1) {
        return false;
      }
      if (/*编辑是false  不能编辑*/(typeof this.$props.props_edit == 'boolean') && !this.$props.props_edit) {
        console.warn('退出逻辑 不能编辑');
        return false;
      }
      return true;
    },

    computed_disabled_atachlist() {
      if (/*如果已經请款的明细是不能编辑的*/this.$props.props_materialReceivingDtl?.payState > 1) {
        return true;
      }
      if (/*编辑是false  不能编辑*/(typeof this.$props.props_edit == 'boolean') && !this.$props.props_edit) {
        console.warn('退出逻辑 不能编辑');
        return true;
      }
      return false;
    },

  },
  methods: {
    toFixedInt,
    change_courierMoney() {
      this.$emit('updatechange');
    },
    async deleteFile(file) {
      if(file&&file.id){
        var resilt=await matertailDevApi.devmateraildelattachf(file.id)
        alertWithPayload(resilt)
      }
    },

    change_materialMoney() {
      this.$emit('updatechange');
    },
    trigger_courierMoney() {
      if (/*编辑是false 退出逻辑*/(typeof this.$props.props_edit == 'boolean') && !this.$props.props_edit) {
        console.warn('退出逻辑 不能编辑');
        return false;
      }

      this.exitZhuansong = !this.exitZhuansong;
      if (!this.exitZhuansong) {
        this.$props.props_develMaterialCheck.courierMoney = 0;
        //排除 专送附件
        var no_zhuansong_attachListFiler = (this.$props.props_develMaterialCheck.attachList || []).filter(item => item.expendType != '专送');
        this.$props.props_develMaterialCheck.attachList = no_zhuansong_attachListFiler || [];
      }
    },

  },

};
</script>
